終於到這系列的最後一篇了！

回顧

這 30 天下來，範例專案的架構改了不少次，因此，讓我們直接用最終的架構，來回顧這個系列和這個工具。

最初的目標

在第一天，我們的目標是：

提供足夠的資訊給 AI Agent 後，由 AI 建立出使用手冊。

以結果來看，在 Day 27 做出一個可以幫助建立使用手冊的 CLI (npm 套件)，在 Day 28-29 做出 Claude Code plugin 來讓 AI Agent 幫我們操作 CLI 建立手冊。我想，這樣應該算是有達成吧！

除了使用手冊「文件」之外，也額外補充了「影片」與「操作導覽」這兩種不一樣的形式。

中間的過程

這 30 天大致上可以分成 5 個階段：

1. 動機說明與技術選擇 (Day 01-04)
2. 基礎介紹 (Day 05-07)
3. 功能實作 (Day 08-21)
4. 延伸應用 (Day 22-26)
5. 打包與分享 (Day 27-29)

最終的專案架構

範例專案 auto-manual-gen 現在長這個樣子，每個資料夾後面標的是主要介紹或實作它的那幾天：

auto-manual-gen/
├── apps/demo-stream-app/      # 被拍的範例 App (Day 06)
│   └── TESTID.md              #   data-testid 命名規範 (Day 08)
├── packages/auto-manual-gen/  # 產線本體，一個可以發布的 CLI (Day 27)
│   ├── src/drivers/           #   AppDriver：用同一套腳本驅動 Web 與 Electron (Day 07)
│   ├── src/boot.ts            #   開機、狀態注入、凍結時間 (Day 09)
│   ├── src/overlay/           #   畫框、標號 (Day 11–12)，錄影用的假游標 (Day 24)
│   ├── src/video/             #   字幕、旁白、影片編碼 (Day 24–25)
│   ├── src/commands/          #   每個指令一個檔案，見下一節
│   └── schema/v1/             #   manifest 與 manual.yaml 的 schema (Day 14)
├── manual.yaml                # 手冊專案的根：語言、開機設定、怎麼啟動 App (Day 14、22、27)
├── config.example.json        # 個人環境設定的範本 (Day 05)
├── manifest/                  # 章節與步驟，唯一需要人決定內容的地方 (Day 14)
├── docs/                      # 正文 (Day 18–19)
│   └── en/                    #   其他語言的正文 (Day 22–23)
├── templates/                 # reference.docx 與 manual.css (Day 20–21)
├── agent/                     # 給 AI agent 的上下文：UI-MAP / QUIRKS / STYLE (Day 16、18)
├── plugin/                    # Claude Code plugin：skills / agents / hooks (Day 28–29)
├── .claude-plugin/            #   讓這個 repo 同時是一個 marketplace (Day 29)
└── screenshots/  output/      # 產物，不進版控

整個 repo 可以分成三塊來看：

• packages/auto-manual-gen/：負責「做」。讀 manifest、開 App、操作、截圖、標註、遮蔽、產出文件，全部都是決定性的程式，沒有 AI。
• repo 根目錄的手冊專案 (manual.yaml、manifest/、docs/、templates/)：負責「寫」。這是 agent 與人一起維護的內容，CLI 只是照著它跑。
• apps/demo-stream-app/：被拍的對象。實務上它應該是另一個 repo，放在一起只是方便大家 clone 一次就能跑。

心得

一開始在活動開始前，已經想了好幾個主題，也都大致擬好文章架構，但後來發現大多都跟這次主題不太相關，只好先繼續放著 ，等哪天很閒的時候再來慢慢寫。反倒是這次有一堆跟 AI 有關的主題，就想說不如把前陣子在研究的 AI 自動化腳本拿來分享。寫著寫著，發現其實有蠻多可以再優化的地方，也發現許多一開始沒想到的延伸應用，導致架構改了不少次XD

雖然經歷了一些波折，但幸好最終還是有勉強完成這次的挑戰。接下來，我應該會繼續打磨一下這個工具。我預計要拿這套工具在公司的各個專案套用看看，同時也讓公司的其他同事用用看 (前陣子有看到同事花了不少時間在剪教學影片@@)。

最後，提一點未來展望。雖然這套工具的核心功能應該都大致完成了，但其實還有一些有想到但沒時間嘗試的功能，這邊也分享給大家，當作拋磚引玉XD

1. 搭配 live2D 技術，在畫面角落疊加一個虛擬腳色 (類似 vtuber 那樣)，由這個虛擬腳色進行功能說明。
2. 影片應該可以設計更多轉場動畫或是字卡，也說不定可以添加音樂或音效。
3. 或許不只可以做使用手冊，也可以做故障排除指南、安裝說明等其他文件。